<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link href="../assets/css/bootstrap.css" rel="stylesheet" />
		<!-- FONTAWESOME STYLES-->
		<link href="../assets/css/font-awesome.css" rel="stylesheet" />
		<!-- CUSTOM STYLES-->
		<link href="../assets/css/custom.css" rel="stylesheet" />
		<!-- GOOGLE FONTS-->
		<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css' />
		<link rel="stylesheet" href="../assets/command/Bootstrap/bootstrap-3.3.0/css/bootstrap.min.css" />
		<link rel="stylesheet" href="../assets/command/bower_components/bootstrap-treeview/dist/bootstrap-treeview.min.css" />
		<script src="../assets/command/jquery-3.4.0.min.js"></script>
		<script src="../assets/command/Bootstrap/bootstrap-3.3.0/js/bootstrap.min.js"></script>
		<script src="../assets/command/bower_components/bootstrap-treeview/dist/bootstrap-treeview.min.js"></script>
		<script src="../assets/command/bower_components/moment/min/moment.min.js"></script>
		<script src="../assets/command/bower_components/moment/min/locales.min.js"></script>
		<script src="../assets/command/bower_components/bootbox/bootbox.min.js"></script>
		<script src="../assets/command/bower_components/bootstrap-select/dist/js/bootstrap-select.js" type="text/javascript"
		 charset="utf-8"></script>
		<script src="../assets/command/bower_components/bootstrap-switch/dist/js/bootstrap-switch.min.js" type="text/javascript"
		 charset="utf-8"></script>
		<script src="../assets/command/bower_components/bootstrap-table/dist/bootstrap-table.min.js" type="text/javascript"
		 charset="utf-8"></script>
		<script src="../assets/command/bower_components/bootstrap-table/dist/locale/bootstrap-table-zh-CN.js" type="text/javascript"
		 charset="utf-8"></script>
		<script src="../assets/command/bower_components/moment/min/locales.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<script type="text/javascript">
		$(function() {
			$.ajax({
				type: "get",
				dataType: "json",
				url: "../json/liebiao.json",
				success: function(reslt) {
					creteTable(reslt)
				},
				error: function(date) {
					alert(date);
				}
			});
			$("#btnNew").click(function() {
				$("#dowloadData").modal();
			})
			$("#btnUpdate").click(function() {
				$("#updatediv").modal();
			})
			$("#btnSelect").click(function() {
				$("#selectdiv").modal();
			})
			$("#btnDel").click(function() {
				$("#deletedelData").modal();
			})
		});
			function creteTable(userData) {
				$("#tblUser").bootstrapTable("destroy");
				$("#tblUser").bootstrapTable({
					data: userData,
					loadMsg: "正在加载数据",
					sidePagination: "client",
					pageSize: "5",
					pagination: true,
					singleSelect: true,
					columns: [{
							field: "uid",
							checkbox: true,
							align: "center"
						},
						{
							field: "htname",
							title: "合同名称",
							align: "center"
						},
						{
							field: "begintime",
							title: "开始时间",
							align: "center"
						},
						{
							field: "endtime",
							title: "结束时间",
							align: "center"
						},
						{
							field: "money",
							title: "合同金额",
							align: "center"
						},
						{
							field: "fj",
							title: "附件",
							align: "center"
						},
						{
							field: "gsmc",
							title: "公司名称",
							align: "center"
						},
						{
							field: "lxr",
							title: "合同方联系人",
							align: "center"
						},
						{
							field: "tel",
							title: "合同方联系人电话",
							align: "center"
						}
					]
				})
			}
		</script>
	<body>
		<h2>项目列表信息</h2>
		<h5>欢迎回到项目列表信息页面 </h5>


		<!-- /. ROW  -->
		<hr />
		<div class="row">
			<div class="col-md-12">
				<!-- Form Elements -->
				<div class="panel panel-default">
					<div class="panel-heading">
						搜索

					</div>
					<div class="panel-body">
						<div class="row">
							<div class="col-md-12">
								<form role="form">
									<div class="control-group">
										<label class="control-label " for="">合同编号：</label>
											<input class="form-inline" type="text" id="" placeholder="">&nbsp;
											<label class="control-label " for="">合同名称：</label>
											<input class="form-inline" type="text" id="" placeholder="">&nbsp;
											<label class="control-label " for="">合同类型：</label>
											<input class="form-inline" type="text" id="" placeholder=""><br /><br />
											<label class="control-label " for="">合同截至时间：</label>
											<input class="form-inline" type="text" id="" placeholder="">
											
											<button class="btn btn-info">查询</button>
										</div>
										<div class="container-fluid">
											</div>
										</div>
										</div>
										</div>
									    
											<div class=" row col-md-10" style="margin-top: 15px; margin-left: px;">
													<button id="btnNew" class=" btn btn-default" type="button">新增</button>
													<button id="btnUpdate" class=" btn btn-success" type="button">修改</button>
													<button id="btnDel" class=" btn btn-danger" type="button">删除</button>
												</div>
										
											<div class="row col-md-10">
												<table id="tblUser"></table>
											</div>
						<div class="modal fade" id="dowloadData" tabindex="-1" role="dialog" aria-labelledby="myModelLable" aria-hidden="hidden">
							<div class="modal-dialog">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal" aria-hidden="true">关闭</button>
										<h4 class="modal-title" id="">下载合同</h4>
									</div>
									<div class="modal-body form-inline">
										<table class="table">
											<thead>
												<tr>
													<th scope="col">#</th>
													<th scope="col">合同名称</th>
													<th scope="col">时间</th>
													<th scope="col">状态</th>
												</tr>
											</thead>
											<tbody>
												<tr>
													<th scope="row">1</th>
													
													<td>合同1</td>
													<td>2019-7-05</td>
													<td>成功</td>
												</tr>
												<tr>
													<th scope="row">2</th>
													<td>合同1</td>
													<td>2019-7-05</td>
													<td>成功</td>
												</tr>
												<tr>
													<th scope="row">3</th>
													<td>合同1</td>
													<td>2019-7-05</td>
													<td>成功</td>
												</tr>
											</tbody>
										</table>
										<div class="modal-footer">
											<button type="button" id="btnsave" class="btn btn-info">新增</button>
										</div>
									</div>
								</div>
							</div>
						</div> 
																<div class="modal fade" id="deletedelData" tabindex="-1" role="dialog" aria-labelledby="myModelLable"
						 aria-hidden="hidden">
							<div class="modal-dialog">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal" aria-hidden="true">关闭</button>
										<h4 class="modal-title" id="">删除用户</h4>
									</div>
									<div class="modal-body form-inline">
										<table class="table">
											<thead>
												<tr>
													<th scope="col">#</th>
													<th scope="col">姓名</th>
													<th scope="col">性别</th>
													<th scope="col">状态</th>
												</tr>
											</thead>
											<tbody>
												<tr>
													<th scope="row">1</th>
						
													<td>合同1</td>
													<td>2019-7-05</td>
													<td>成功</td>
												</tr>
												<tr>
													<th scope="row">2</th>
													<td>合同1</td>
													<td>2019-7-05</td>
													<td>成功</td>
												</tr>
												<tr>
													<th scope="row">3</th>
													<td>合同1</td>
													<td>2019-7-05</td>
													<td>成功</td>
												</tr>
											</tbody>
										</table>
										<div class="modal-footer">
											<button type="button" id="btnsave" class="btn btn-info">删除</button>
										</div>
									</div>
								</div>
							</div>
						</div>
						
						<div class="modal fade" id="updatediv" tabindex="-1" role="dialog" aria-labelledby="myModelLable" aria-hidden="hidden">
							<div class="modal-dialog">
								<div class="modal-content">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal" aria-hidden="true">关闭</button>
										<h4 class="modal-title" id="">详细信息</h4>
									</div>
									<div class="modal-body form-inline">
										<div class="form-group">
											<label class="control-lable" for="">合同名称：</label>
											<input type="text" id="txttel" name="Datatel" maxlength="20" class="form-control" />
											<button type="button" id="btnsave" class="btn btn-info">修改</button><br /><br />
											<label class="control-lable" for="">创建时间：</label>
											<input type="text" id="txttel" name="Datatel" maxlength="20" class="form-control" />
											<button type="button" id="btnsave" class="btn btn-info">修改</button><br /><br />
											<label class="control-lable" for="">创建人名：</label>
											<input type="text" id="txttel" name="Datatel" maxlength="20" class="form-control" />
											<button type="button" id="btnsave" class="btn btn-info">修改</button><br /><br />
										</div>
	</body>
</html>
